const Directives = {};
Directives.install = (Vue, options)=> {
    Vue.directive('src', {
        bind (el, binding, vnode, oldVnode) {
            const dom = vnode.elm;
            const {src,width:domWidth,height:domHeight} = binding.value;
            const IMG = new Image();
            IMG.onload = e=> {
                const {height,width} = e.path[0];
                console.log(width,height)
                const heightScale = height/domHeight;
                const useWidth = width/heightScale;
                const widthDiff = useWidth - domWidth;
                const center = widthDiff>0?widthDiff/2:0;
                el.src = src;
                el.style.position = 'relative';
                el.style.left = center?center*(-1)+'px':'';
            }
            IMG.src = src;
        }
    })
}
export default Directives;